{% load i18n %}
	{% if user.is_authenticated %}
	{% else %}
			{% if need_auth_form %}
				{% include "component/auth_form.html" %}
			{% endif %}
	{% endif %}
	<nav class="navbar navbar-default">
		<div class="navbar-header">
			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="/home/">5K Run <sub class="text-muted">beta</sub></a>
		</div>
		<div class="collapse navbar-collapse navbar-ex1-collapse">
			<ul class="nav navbar-nav">
				<li><a href="/events/">{% trans "Events" %}</a></li>
				<li><a href="/about/">{% trans "About us" %}</a></li>
			</ul>
			{% if user.is_authenticated %}
				<ul class="nav navbar-nav navbar-right">
					<li>
						<form class="navbar-form" action="/user/" role="form">
						  <button type="submit" class="btn btn-default" value="userprofilepage"><i class="fa fa-cogs"></i> {{ user.email }}</button>
						</form>
					</li>
					<li>
						<a href="/user/logout/">{% trans "Log out" %}</a>
						<form id="logoutForm" action="." method="POST" style="display:none;">
							{% csrf_token %}
							<input type="hidden" name="action" value="logout">
						</form>
					</li>
				</ul>
			{% else %}
				{% if need_auth_form %}
					<ul class="nav navbar-nav navbar-right">
						<li><a class="login_btn" href="#authdlg" data-toggle="modal" data-keyboard="true">{% trans "Log In" %}</a></li>
						<li class="divider-vertical"></li>
						<li><a class="signup_btn" href="#authdlg" data-toggle="modal" data-keyboard="true"><strong class="text-primary">{% trans "Sign up" %}</strong></a></li>
					</ul>
				{% elif auth_block %}
					<ul class="nav navbar-nav navbar-right">
						<li><a class="login_btn"><i class="fa fa-ban"></i><del> {% trans "Log In" %}</del></a></li>
						<li class="divider-vertical"></li>
						<li><a class="signup_btn"><i class="fa fa-ban"></i><del><strong> {% trans "Sign up" %}</strong></del></a></li>
					</ul>
				{% endif %}
			{% endif %}
		</div>
	</nav>
<script type="text/javascript">
	$(document).ready(function(){
		$('li', '.nav').each( function() { 
			var o = $(this).find('a');
			var path = $(o).attr('href');
			if( location.pathname.indexOf(path) == -1 )
			{	
				if( $(this).hasClass('active') )
					$(this).removeClass('active');
			}
			else
			{
				if( $(this).hasClass('active')==false )
					$(this).addClass('active');
			}
		})
	});
</script>